<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>作者</title>
    <link rel="stylesheet" href="../css/main.css">
    <link rel="stylesheet" href="../css/author.css">
    <script src="../js/jquery.js"></script>
    <script src="../js/main.js"></script>
    <script src="../js/Info.js"></script>
    <script src="../js/author.js"></script>
</head>
<body>
<div class="header min_width">
    <div class="container">
        <div class="header-bar">
            <div class="header-left">
                <img src="../images/logo.png" alt="">
            </div>
            <div class="header-right" style="background-color: #5ca11f; width: 100px;">
                <div class="shop">
                    <!-- <img src="images/shop.png" alt="">
                    <span>2</span> -->
                </div>
                <div class="user">
                    <a style="display: block; text-align: center; width: 100px; color: #fff; font-size: 18px; cursor: pointer;" id="SignIn" class="">
                        Sign In or On
                    </a>
                    <span class="exit">EXIT</span>
                    <!-- <img src="images/user.png" alt="">
                    <span>Sun Jifeng</span> -->
                </div>
            </div>
        </div>
        <div class="nav">
            <div class="nav-cover">
                <ul class="nav-item">
                    <li><a href="file.html">Web Themes & Templates</a></li>
                    <li><a href="#">Code</a></li>
                    <li><a href="#">Video</a></li>
                    <li><a href="#">Audio</a></li>
                    <li><a href="#">Graphics</a></li>
                    <li><a href="#">Potos</a></li>
                    <li><a href="#">3D</a></li>
                    <span></span>
                </ul>
            </div>
        </div>
    </div>
</div>
<div class="sec-nav">
    <div class="container">
        <ul class="sec-item">
            <li><a href="#">All Items</a></li>
            <li><a href="#">WordPres</a></li>
            <li><a href="#">Simple Site Builder</a></li>
            <li><a href="#">HTML</a></li>
            <li><a href="#">Marketing</a></li>
            <li><a href="#">CMS</a></li>
            <li><a href="#">eCommerce</a></li>
            <li><a href="#">Muse</a></li>
            <li><a href="#">UI Design</a></li>
            <li><a href="#">Plugins</a></li>
            <li><a href="#">More</a></li>
        </ul>
    </div>
</div>
<!-- <div class="main-body">
    <div class="container">
        <div class="search">
            <input type="text" placeholder="Search within these result"><button>Search</button>
        </div>
    </div>
</div> -->





<!-- 作者 -->

<section class="author min_width">
    <div class="author_up">
        <div class="author_container">
            <div class="author_up_left">
                <div>
                    <img src="../images/author.png">
                </div>
            </div>
            <div  class="author_up_body">
                <div>
                    <h2>yahyaessam</h2>
                    <p>Member since November 2014</p>
                    <button class="hover">View Portfolio</button>
                    <button>Follow</button>
                </div>
            </div>
            <div  class="author_up_right">
                <div>
                    <div>
                        <div>
                            <strong>Author Rating</strong>
                        </div>
                        <div class="rating">
                            <div class="star_rating" id="star">
                                <b></b>
                                <b></b>
                                <b></b>
                                <b></b>
                                <b></b>
                            </div>
                            <div>
                                <span class="author_rating">(167 ratings)</span>
                            </div>
                        </div>
                    </div>
                    <div>
                        <div>
                            <strong>Sales</strong>
                        </div>
                        <div>
                            <div>
                                <span class="author_Sales">4,741</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="author_container author_tab">
            <button class="active">Portfolio</button>
            <button>Followers<i id="followers_num">0</i></button>
            <button>Following<i id="following_num">0</i></button>
        </div>
    </div>
</section>

<!-- /作者 -->

<!-- Tabs -->
<section class="tabs min_width">
    <div class="author_container" id="tabs">
        <div class="tab_1">
            <div class="tab_left" id="tab1_left">
                <div class="tab1_model">
                    <div class="media_left">
                        <div>
                            <img src="../images/author_head.png" alt="" width="80">
                            <p>
                                <i class="tab_like"></i>
                                <i class="tab_package"></i>
                                <i class="tab_shop"></i>
                            </p>
                        </div>
                        <div class="media_left_right">
                            <h3>Pirana - Responsive Personal Template</h3>
                            <a href="javascript:;">yahyaessam</a>    
                        </div>
                    </div>
                    <div class="media_body">
                        <p>in WordPress / Corporate / Business High Resolution: Yes, Widget Ready: Yes, Compatible WordPress 4.4.1, WordPress 4.4, WordPress 4.3.1, WordPress 4.3, WordPress 4.2, WordPress 4.1, WordPress 4.0, Columns: 4+ </p>
                    </div>
                    <div class="media_right">
                       <div><strong>$14</strong></div>
                       <div>
                           <i></i>
                           <span>7 Sales</span>
                       </div> 
                    </div>
                </div>
                <div id="tab1_page">
                    <!-- <a href="#" class="prev">&lt;</a> -->
                    <a href="#1" class="active_page">1</a>
                    <!-- <a href="#2">2</a>
                    <a href="#2">3</a>
                    <a href="#2" class="prev">&gt;</a> -->
                </div>
            </div>
            <div class="tab_right">
                <div class="tab_search">
                    <h4>Search portfolio</h4>
                    <div>
                        <input type="text" placeholder="Search Portfolio">
                    </div>
                </div>
                <div class="tab_about">
                    <h4>About the author</h4>
                    <div>
                        <a href="javascript:;" title="">
                            <img src="../images/author.png" alt="" width="80">
                            <span>yahyaessam</span>
                        </a>
                    </div>
                </div>
                <div class="tab_contact">
                    <h4>Contact the author</h4>
                    <div>
                        <p>phone: 15568326777</p>
                        <p>Email: 338497387@qq.com</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="tab_2">
            <div class="tab_left">
                <div id="tab2_left">
                    <!-- <div class="tab2_model">
                        <div class="media_left">
                            <div>
                                <img src="../images/tab2.png" alt="" width="80">
                                <p><button>Follow</button></p>
                            </div>
                            <div class="media_left_right">
                                <h3>NajahLabs</h3>
                            </div>
                        </div>
                        <div class="media_body">
                            <p>7 Items</p>
                            <p>14 Followers</p>
                            <p>Member Since:January 2017</p>
                            <p>Available for freelance work</p>
                        </div>
                        <div class="media_right">
                           <div>
                                <strong>186</strong>
                                <b>Sales</b>
                           </div>
                           <div class="tab2_star">
                               <div class="star_rating star_num">
                                    <b></b>
                                    <b></b>
                                    <b></b>
                                    <b></b>
                                    <b></b>
                                </div>
                               <span>10 ratings</span>
                           </div> 
                        </div>
                    </div> -->
                </div>
                <div id="tab2_page">
                    <!-- <a href="#" class="prev">&lt;</a> -->
                    <a href="#1" class="active_page">1</a>
                    <!-- <a href="#2">2</a>
                    <a href="#2" class="prev">&gt;</a> -->
                </div>
            </div>
        </div>
        <div class="tab_3">
            <div class="tab_left">
                <div id="tab3_left">
                    
                </div>
<!--                 <div class="tab3_model">
                    <div class="media_left">
                        <div>
                            <img src="../images/tab3.png" alt="" width="80">
                            <p><button>Follow</button></p>
                        </div>
                        <div class="media_left_right">
                            <h3>emiluzelac</h3>
                        </div>
                    </div>
                    <div class="media_body">
                        <p>7 Items</p>
                        <p>14 Followers</p>
                        <p>Member Since:January 2017</p>
                        <p>Available for freelance work</p>
                    </div>
                    <div class="media_right">
                       <div>
                            <strong>186</strong>
                            <b>Sales</b>
                       </div>
                       <div class="tab3_star">
                           <div class="star_rating" id="tab3_star">
                                <b></b>
                                <b></b>
                                <b></b>
                                <b></b>
                                <b></b>
                            </div>
                           <span>10 ratings</span>
                       </div> 
                    </div>
                </div> -->
                <div id="tab3_page">
                    <!-- <a href="#" class="prev">&lt;</a> -->
                    <a href="#1" class="active_page">1</a>
                    <!-- <a href="#2">2</a>
                    <a href="#2">3</a>
                    <a href="#2" class="prev">&gt;</a> -->
                </div>
            </div>
        </div>
    </div>
</section>
<!-- /Tabs -->





<footer class="min_width">
    <div class="container">
        <div class="footer_up">
            <ul>
                <li>
                    <h5>ENVATO MARKEI</h5>
                </li>
                <li>
                    <a href="javascript:;" title="">Terms</a>
                </li>
                <li>
                    <a href="javascript:;" title="">Licenses</a>
                </li>
                <li>
                    <a href="javascript:;" title="">Market API</a>
                </li>
                <li>
                    <a href="javascript:;" title="">Become an affiliate</a>
                </li>
            </ul>
            <ul>
                <li>
                    <h5>HELP</h5>
                </li>
                <li>
                    <a href="javascript:;" title="">Themes and Templates</a>
                </li>
                <li>
                    <a href="javascript:;" title="">Websites</a>
                </li>
                <li>
                    <a href="javascript:;" title="">AUthors API</a>
                </li>
                <li>
                    <a href="javascript:;" title="">Help Center</a>
                </li>
            </ul>
            <ul>
                <li>
                    <h5>JOIN OUR COMMUNITY</h5>
                </li>
                <li>
                    <a href="javascript:;" title="">Community</a>
                </li>
                <li>
                    <a href="javascript:;" title="">Blog</a>
                </li>
                <li>
                    <a href="javascript:;" title="">Forums</a>
                </li>
                <li>
                    <a href="javascript:;" title="">Meetups</a>
                </li>
            </ul>
            <img src="../images/logo.png" alt="">
        </div>
        <div class="footer_down">
            <ul>
                <li><a href="javascript:;" title="">About Envato</a></li>
                <li><a href="javascript:;" title="">Careers</a></li>
                <li><a href="javascript:;" title="">Privacy policy</a></li>
                <li><a href="javascript:;" title="">Sitemap</a></li>
            </ul>
            <p>All prices are in US dollars</p>
            <p>© 2018 Envato Pty Ltd. Trademarks and brands are the property of their respective owners.</p>
        </div>
    </div>
</footer>
<script>
    $(".exit").click(function(){
        window.location.href="sign.html";
    });
</script>

</body>
</html>